<template>
	<sw-form-frame v-model="visible" title="公告" top="10vh" width="992" :type="formType" :loading="btnLoading" footer @submit="handleSubmitForm()">
		<el-form ref="form" size="medium" :model="formData" :rules="formRules" v-loading="loading">
			<el-row type="flex" :gutter="20" class="notice_form_container">
				<el-col :span="17">
					<el-form-item label="公告名称" prop="title">
						<el-input v-model="formData.title"></el-input>
					</el-form-item>
					<el-form-item label="公告内容" prop="content">
						<u-editor v-model="formData.content" :ue-height="360"></u-editor>
					</el-form-item>
				</el-col>
				<el-col :span="7">
					<el-form-item label="发布时间" prop="releaseTime">
						<el-date-picker v-model="formData.releaseTime" v-bind="dateConfig"></el-date-picker>
					</el-form-item>
					<el-form-item label="序号">
						<el-input-number v-model="formData.sort" controls-position="right" :min="1"></el-input-number>
					</el-form-item>
					<el-form-item label="公告附件" prop="attrList">
						<sw-file-uploader v-model="formData.attrList"></sw-file-uploader>
					</el-form-item>
				</el-col>
			</el-row>
		</el-form>
	</sw-form-frame>
</template>

<script>
import lodash from 'lodash';
import formMixins from '@/mixins/formMixins';
import { queryJournalism, addedJournalism, updateJournalism } from '@/api/platform/tbSysJournalism';
export default {
	mixins: [formMixins],
	data() {
		return {
			attachList: [],
			formName: '公告',
			dateConfig: {
				type: 'date',
				style: { width: '100%' },
				valueFormat: 'yyyy-MM-dd',
				placeholder: '选择发布时间'
			},
			formRules: {
				title: { required: true, message: '请输入公告名称', trigger: 'blur' },
				content: { required: true, message: '请输入公告内容', trigger: 'change' },
				releaseTime: { required: true, message: '请选择发布时间', trigger: 'change' }
			}
		};
	},
	computed: {
		detailData() {
			return eval(queryJournalism);
		},
		callFunction() {
			return eval(this.addOrEdit ? addedJournalism : updateJournalism);
		},
		requestParams() {
			return { id: this.dataId, isRecord: '2' };
		},
		submitParams() {
			let params = { ...this.formData };
			let addArrs = lodash.differenceBy(params.attrList, this.attachList, 'id');
			let delArrs = lodash.differenceBy(this.attachList, params.attrList, 'id');
			let addParams = addArrs.map((n) => ({ relId: n.id, operType: '1' }));
			let delParams = delArrs.map((n) => ({ relId: n.id, operType: '2' }));
			params['fileList'] = [...addParams, ...delParams];
			return params;
		}
	},
	methods: {
		formatFormParams() {
			let attachList = this.formData.attrList || [];
			let attachDatas = attachList.map((n) => {
				return { ...n, name: `${n.oldName}.${n.attrSuffixStr}` };
			});
			this.attachList = lodash.cloneDeep(attachList);
			this.$set(this.formData, 'attrList', attachDatas);
		}
	}
};
</script>

<style lang="scss" scoped>
.notice_form_container::v-deep {
	.el-form-item__label {
		float: none;
		display: block;
		line-height: 1;
		font-size: 15px;
		text-align: left;
		font-weight: bold;
		margin-bottom: 10px;
	}
	.el-input__inner {
		font-size: 15px;
	}
}
</style>
